<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购物车</title>
    <link rel="stylesheet" href="/static/dist/css/cart.css" th:href="@{/dist/css/cart.css}">
    <link rel="stylesheet" href="/static/dist/css/reset.css" th:href="@{/dist/css/reset.css}" >
    <link rel="stylesheet" href="/static/dist/font/iconfont.css" th:href="@{/dist/font/iconfont.css}">
    <!--	<link rel="stylesheet" href="/static/dist/css/index.css" th:href="@{/dist/css/index.css}">-->
    <!--	<link rel="stylesheet" href="/static/dist/css/reset.css" th:href="@{/dist/css/reset.css}">-->

</head>

<body>
    <div class="menu">
        <div class="menu-cen">
            <span class="iconfont icon-index"></span>
            <a href="/tmall/index">天猫首页</a>
            <p>喵，欢迎来天猫国际</p>
            <i id="tui"><a href="login.html" id="ming">请登录</a></i>
            <ul class="menu-you">
                <li class="yi"><a>我的淘宝</a>
                    <div>
                        <a href="">已买到的宝贝</a>
                        <a href="">已卖出的宝贝</a>
                    </div>
                </li>
                <li>
                    <span class="iconfont icon-gouwuche"><a href="">购物车</a></span>
                </li>
                <li class="yi"><a href="">收藏夹</a>
                    <div>
                        <a href="">收藏的宝贝</a><br>
                        <a href="">收藏的店铺</a>
                    </div>
                </li>
                <li class="san">
                    <span class="iconfont icon-icon1460357101473"><a href="">手机版</a></span>
                    <div>
                        <img src="../img/soujima.png" alt="">
                    </div>
                </li>
                <li><a href="">淘宝网</a></li>
                <li class="er"><a>商家支持</a>
                    <div>
                        <ul>
                            <li>
                                <h3>商家：</h3>
                                <a href="">商家中心</a>
                                <a href="">天猫规则</a>
                                <a href="">商家入驻</a>
                                <a href="">运营服务</a>
                                <a href="">商家工具</a>
                                <a href="">商家规则</a>
                                <a href="">天猫智库</a>
                                <a href="">喵言喵语</a>
                            </li>
                            <li>
                                <h3>帮助：</h3>
                                <a href="">帮助中心</a>
                            </li>
                        </ul>
                    </div>
                </li>
                <li class="si">
                    <span class="iconfont icon-liebiao"><a href="">网站导航</a></span>
                    <div class="si-da">
                        <div class="yi">
                            <h2>热点推荐 Hot</h2>
                            <ul>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">喵鲜生</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">喵鲜生</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">喵鲜生</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">喵鲜生</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">天猫超市</a></li>
                                <li><a href="">天猫超市</a></li>
                            </ul>
                        </div>
                        <div class="er">
                            <h2>行业市场 Market</h2>
                            <ul>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                            </ul>
                        </div>
                        <div class="san">
                            <h2>品牌风尚 Brand</h2>
                            <ul>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                                <li><a href="">美妆</a></li>
                            </ul>
                        </div>
                        <div class="si">
                            <h2>服务指南 Help</h2>
                            <ul>
                                <li><a href="">天猫国际规则 </a></li>
                                <li><a href="">海外正品 </a></li>
                                <li><a href="">七天放心退 </a></li>
                                <li><a href="">商标代理 </a></li>
                                <li><a href="">帮助中心</a></li>
                            </ul>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <div class="sou">
        <img src="../img/logo.png" alt="" class="yi">购物车
        <input type="text" class="sou-kuang" placeholder="  搜索 天猫 商品/品牌/店铺">
        <input type="button" value="搜索" class="sou-btn">
    </div>
    <div class="tou">
        <i>全部商品</i>
        <i>降价商品</i>
        <i>库存紧张</i>
        <b>已选商品（不含运费）</b>
        <span id="q2">0.00</span>
        <a href="">结算</a>
    </div>

    <table class="ts">
        <thead>
        <td><input type="checkbox" name="" id="qx"></td>
        <td>商品信息</td>
        <td>单价</td>
        <td>数量</td>
        <td>金额</td>
        <td>操作</td>
        </thead>
        <tbody id="div">
        <tr th:each="x:${list}">
            <td>
                <!--                <div class="layui-unselect layui-form-checkbox" lay-skin="primary" th:data-id="${x.uId}" ><i class="layui-icon">&#xe605;</i></div>-->
                <input type="checkbox" th:value="${x.id}" >
            </td>
            <!--            <td th:text="${x.userDetail.udId}" style="display: none"></td>-->
            <td th:text="${x.products.name}"></td>
            <td th:text="${x.products.promotePrice}"></td>
            <td th:text="${x.number}" ></td>
            <td th:text="${x.total}" ></td>

        </tr>
        </tbody>
    </table>
    <div class="sb" id="sb">

    </div>

    <div class="ding">
        <input type="checkbox" name="qx21" id="qx2" onclick="All()">全选
        <em id="sc2">删除</em>
        <p>清除失效宝贝</p>
        <p>移入收藏夹</p>
        <p>分享</p>
        <span >已选商品 <i id="shul" value="">0</i> 件</span>
        <b>合计（不含运费）：<i id="q1">0.00</i></b>
        <div>
            结算
        </div>
    </div>

<!--<<<<<<< HEAD-->
<!--<script src="../js/jquery-1.11.0.js"></script>-->
<!--<script src="../js/cart.js"></script>-->
<!--=======-->
<!--    <script src="../js/jquery-1.11.0.js"></script>-->
<!--    <script src="../js/cart.js"></script>-->
<script>
        window.onload=function(){
            var CheckAll=document.getElementById('qx');
            var CheckAll2=document.getElementById('qx2');
            var div=document.getElementById('div');
            var CheckBox=div.getElementsByTagName('input');
            var c=0;
            var d=0;
            CheckAll.onclick=function(){
                CheckAll2.checked=CheckAll.checked;

                if(CheckAll.checked==true){
                    for(var i=0;i<CheckBox.length;i++){
                        CheckBox[i].checked=true;
                    };
                }else {
                    for(var i=0;i<CheckBox.length;i++){
                        CheckBox[i].checked=false;
                    }
                }
            //    得到总金额和总产品数

                for(var i=0;i<CheckBox.length;i++){
                   if(CheckBox[i].checked==true){
                       var e=CheckBox[i].value;
                       d++;
                      // alert(d);
                   }
                }
                document.getElementById("shul").innerHTML=d;
                d=0;

            };

            CheckAll2.onclick=function(){
                CheckAll.checked=CheckAll2.checked;

                if(CheckAll2.checked==true){
                    for(var i=0;i<CheckBox.length;i++){
                        CheckBox[i].checked=true;
                    };
                }else {
                    for(var i=0;i<CheckBox.length;i++){
                        CheckBox[i].checked=false;
                    }
                }
//    得到总金额和总产品数

                for(var i=0;i<CheckBox.length;i++){
                    if(CheckBox[i].checked==true){
                        var f=CheckBox[i].value;
                        d++
                        // alert(d);
                    }
                }
                document.getElementById("shul").innerHTML=d;
                    d=0;
            };

            for(var i=0;i<CheckBox.length;i++){
                CheckAll2.checked=CheckAll.checked;
                CheckBox[i].onclick=function(){
                    if(!this.checked){
                        CheckAll.checked=false;
                        CheckAll2.checked=false;
                    }
                    if(CheckAll.checked==false){
                        for(var i=0;i<CheckBox.length;i++){
                            if(CheckBox[i].checked==true){
                                c=c+1;
                            }
                        }
                    }
                    if(c==CheckBox.length){
                        CheckAll.checked=true;
                        CheckAll2.checked=true;
                    }
                    c=0;
                    //    得到总金额和总产品数

                    for(var i=0;i<CheckBox.length;i++){
                        if(CheckBox[i].checked==true){
                            var f=CheckBox[i].value;
                            d++;
                            // alert(d);
                        }
                    }
                    document.getElementById("shul").innerHTML=d;
                    d=0;
                }
            }

        };


    // function All() {
    //     // var obj = document.getElementsByTagName("input");
    //     // for(var i=0; i<obj.length; i ++){
    //     //     if(obj[i].checked){
    //     //         alert(obj[i].value);
    //     //     }
    //     // }
    //     var box = document.getElementById("qx2");
    //     if(box.checked){
    //         alert("box is checked");
    //
    //     }
    //
    //
    // }

</script>

</body>

</html>